<template>
    <div class="searchLine">
        <div id="fl" @click="handleBack()">返回</div>
        <div class="search fl">
                <i class="iconfont icon-search"></i>
                <slot></slot>
        </div>
        <div  id="fl" @click="toSearch()">搜索</div>
    </div>
</template>
<script>
export default {
  // props:["receiveValue"],
  methods: {
    handleBack () {
      // 返回主页
      this.$router.push("/")
    },
    toSearch () {
      this.$emit('changeRouter')
    }
  }

}
</script>
<style lang="scss" scoped>
    .clearfix:after {
        content: "";
        display: block;
        overflow: hidden;
        visibility: hidden;
        width: 0px;
        height: 0px;
        clear: both;
    }
    *{
      margin:0;
      padding: 0;
    }
    a{
        text-decoration: none;
    }
    ul{
      list-style:none;
           list-style:none;
       display: flex;
      justify-content: space-between;
      flex-wrap: wrap

    }
  
    .searchLine{
      z-index: 999;
        height:60px;
        line-height:60px;
        width:95%;
        position:fixed;
        overflow: hidden;
        display: flex;
        justify-content: space-around;
        top: 0;
        left: 0;
        box-shadow: 1px 2px 5px hsla(0,11%,79%,.5);
        background:#fdde4a;
        padding:0px 20px;
        div{
            color: #43240c;
            font-size:16px;
        }
        .search{
            background: #eee;
            width:75%;
            margin:10px 0px 10px 0px;//上右下左
            line-height:38px;
            text-indent:6px;
            border-radius: 5px;
          
            i{
                font-size: 14px;
            }
        }
    }
    #fl{
      font-size: 15px;
    }
      input{
                border:none;
                background:#eee;
                border-radius: 6px;
                font-size:16px;
                // width: 90%;
            }
</style>